<template>
  <table class="table">
    <tr v-for="item in raw" :key="item.id" :class="{marked:isMarked(item.value)}">
      <td>
        <b>{{item.type}}</b>
      </td>
      <td>{{item.value}}</td>
    </tr>
  </table>
</template>

<script>
export default {
  name: "BelbinElement",
  props: ["raw"],
  computed: {
    maxValue() {
      let v = 0;
      for (let i = 0; i < this.raw.length; i++)
        if (v < this.raw[i].value) {
          v = this.raw[i].value;
        }
      return v;
    },
    secValue() {
      let v = 0;
      let s = 0;
      for (let i = 0; i < this.raw.length; i++)
        if (v < this.raw[i].value) {
          s = v;
          v = this.raw[i].value;
        }
      return s;
    }
  },
  methods: {
    isMarked(value) {
      if (value == this.maxValue || value == this.secValue) {
        return true;
      }
      return false;
    }
  }
};
</script>